<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<title>Zero</title>
</head>

<style type="text/css">
	* {
		margin: 0;
		padding: 0;
	}

	#one {
		position: relative;
		top: 100px;
		left: 100px;
		height: 200px;
		width: 300px;
		background-color: #FF0000;
		border-radius: 100px 0 80px 100px;
		transform: rotate(45deg);
	}

	#theOther {
		position: absolute;
		top: 100px;
		left: 183px;
		height: 200px;
		width: 300px;
		background-color: #FF0000;
		border-radius: 0 100px 100px 80px;
		transform: rotate(-45deg);
	}
</style>

<body>
	<div id="one"></div>
	<div id="theOther"></div>
</body>

</html>